<template>
  <page-header-wrapper :title="false">
    <a-card
      :loading="loading"
    >
      <a-tabs type="card" @change="onTabs">
        <a-tab-pane v-for="(item,index) in options['business_category_opts']" :key="index">
          <span slot="tab">
            {{ item }}业务
            <!--              <a-badge :count="item.sum_count + '/' + item.unread" show-zero :number-style="{ backgroundColor: '#1890ff' }"></a-badge>-->
          </span>
        </a-tab-pane>
      </a-tabs>
      <Trademark v-if="activeKey == 10"></Trademark>
      <Patent v-if="activeKey == 20"></Patent>
      <Copyright v-if="activeKey == 30"></Copyright>
      <Design v-if="activeKey == 40"></Design>
      <International v-if="activeKey == 50"></International>
      <ping-gu v-if="activeKey == 70"></ping-gu>
      <Other v-if="activeKey == 300"></Other>
    </a-card>
  </page-header-wrapper>
</template>

<script>
  import { Trademark, Patent, Copyright, Design, International, PingGu, Other } from './components'
  import { getList } from '@/api/business'

  export default {
    name: 'BusinessList',
    components: {
      PingGu,
      Trademark,
      Patent,
      Copyright,
      Design,
      International,
      Other
    },
    data () {
      return {
        visible: false,
        loading: true,
        options: {},
        activeKey: '10',
        tabCount: {},
        labelCol: { span: 6 },
        wrapperCol: { span: 18 },
        layout: 'horizontal',
        ruleForm: {}
      }
    },
    created () {
      this.onTabs(this.activeKey)
    },
    methods: {
      onTabs (key) {
        const app = this
        app.activeKey = key
        getList().then(res => {
          if (res.status === 0) {
            app.options['business_category_opts'] = res.result.business_category_opts
            this.loading = false
            // getCount().then(counts => {
            //   if (counts.status === 0) {
            //     const count = counts.result
            //     const tab = []
            //     for (const k in result) {
            //       if (k === '10') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_sb'],
            //           unread: count['data_count_sb_unread']
            //         })
            //       }
            //       if (k === '20') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_zl'],
            //           unread: count['data_count_zl_unread']
            //         })
            //       }
            //       if (k === '30') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_bq'],
            //           unread: count['data_count_bq_unread']
            //         })
            //       }
            //       if (k === '40') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_sj'],
            //           unread: count['data_count_sj_unread']
            //         })
            //       }
            //       if (k === '50') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_gj'],
            //           unread: count['data_count_gj_unread']
            //         })
            //       }
            //       if (k === '70') {
            //         tab.push({
            //           id: k,
            //           name: result[k]
            //         })
            //       }
            //       if (k === '300') {
            //         tab.push({
            //           id: k,
            //           name: result[k],
            //           sum_count: count['data_count_qt'],
            //           unread: count['data_count_qt_unread']
            //         })
            //       }
            //     }
            //     app.options['business_category_opts'] = tab
            //     this.loading = false
            //   }
            // })
          }
        })
      }
    }
  }
</script>

<style scoped>

</style>
